<template>
  <div class="">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>用户信息</span>
      </div>
      <div class="text item">
        <el-form status-icon label-width="100px" class="demo-ruleForm">
          <el-form-item label="ID" >
            {{info.id}}
          </el-form-item>
          <el-form-item label="头像" >
            <el-image
            style="width: 100px; height: 100px"
            :src="info.avatar"
            :fit="fit">
              <div slot="error" class="image-slot">
                <i class="el-icon-picture-outline" style="font-size: 50px"></i>
              </div>
            </el-image>
          </el-form-item>
          <el-form-item label="用户名" >
            {{info.username}}
          </el-form-item>
          <el-form-item :label="$t('login.phoneNumber')">
            {{info.mobile}}
          </el-form-item>
          <el-form-item :label="$t('login.email')">
            {{info.email}}
          </el-form-item>
          <el-form-item label="最后登录IP">
            {{info.last_login_ip}}
          </el-form-item>
          <el-form-item label="最后登录时间">
            {{info.last_login_time}}
          </el-form-item>
          <el-form-item label="创建时间">
            {{info.create_time}}
          </el-form-item>
        </el-form>
      </div>
    </el-card>
  </div>
</template>

<script>
import { getInfo } from '@/api/merchant'
export default {
  name: 'MerchantDetail',
  components: {},
  props: {
  },
  data() {
    return {
      info: null
    }
  },
  created() {
    const id = this.$route.params && this.$route.params.id
    this.onInfo(id)
  },
  computed: {
  },
  methods: {
    onInfo(id) {
      getInfo(id).then(res => {
        this.info = res.data
      })
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
